import 'package:flutter/material.dart';
import 'package:flutter_test_qq/messageDetailPage.dart';
import 'mainPage.dart';
class messageDetailPage extends StatefulWidget{

 final String title;
 final String subtitle;
 final String pic;

 messageDetailPage({Key? key,
    required this.title,
    required this.subtitle,
    required this.pic}) : super(key: key);

 @override

 chatState createState() => chatState();



}
class chatState extends State<messageDetailPage>{
  static final TextEditingController Message = new TextEditingController();
  var isEnable = false;
  var showButtom = true;

  String get title => widget.title;
  String get pic => widget.pic;
  String get subtitle => widget.subtitle;

  @override
  Widget build(BuildContext context) {
  return  MaterialApp(
    home: Scaffold(
      backgroundColor: Colors.white70,
      appBar: AppBar(
        leading: IconButton(
          icon: Container(
            padding: EdgeInsets.all(1.0),
            child: Icon(Icons.keyboard_arrow_left),
          ),
          onPressed: (){
            Navigator.of(context)
                .push(MaterialPageRoute(builder: (BuildContext context) {
              return mainPage();
            }));
          },
        ),
        title: Text(this.title,style:
          TextStyle(
            fontSize: 20,
          ),
        ),
        actions: [
          Icon(Icons.phone_outlined),
          SizedBox(width: 10,),
          Icon(Icons.menu),
          SizedBox(width: 15,),
        ],
        centerTitle: true,
      ),
      body: SingleChildScrollView(
            child:
             Column(
              children: [
                SizedBox(height: 20,),
                Container(
                  height: 360,
                  child: ListView(
                    children: [
                      // 好友的对话
                      SizedBox(
                        child: Row(
                          children: [
                            SizedBox(width: 10,),
                            CircleAvatar(backgroundImage: AssetImage(this.pic)),
                            SizedBox(width: 10,),
                            Container(
                              decoration: BoxDecoration(
                                color: Colors.white,
                                borderRadius: BorderRadius.circular(8),
                              ),
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Row(
                                    children: [
                                      SizedBox(width: 10,),
                                      Text(this.subtitle,style: TextStyle(
                                          fontSize:15
                                      ),),
                                      SizedBox(width: 10,),
                                    ],
                                  )
                                ],
                              ),
                              height: 30,
                            )
                          ],
                        ),
                        height: 40,
                      ),
                    SizedBox(height: 20,),
                     // 我的对话
                      SizedBox(
                        child: Row(
                          children: [
                            SizedBox(width: 110,),
                            Container(
                              decoration: BoxDecoration(
                                color: Colors.blue,
                                borderRadius: BorderRadius.circular(8),
                              ),
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Row(
                                    children: [
                                      SizedBox(width: 10,),
                                      Text('好啊，表演一下我想看看',style: TextStyle(
                                          fontSize:15,
                                        color: Colors.white
                                      ),),
                                      SizedBox(width: 10,),
                                    ],
                                  )
                                ],
                              ),
                              height: 30,
                            ),
                            SizedBox(width: 10,),
                            CircleAvatar(backgroundImage: AssetImage('images/headPic.jpg')),
                            SizedBox(width: 10,),
                          ],
                        ),
                        height: 40,
                      ),
                    ],
                  ),
                ),
                SizedBox(height: 40,

                ),
                SizedBox(
                  child: Container(
                    decoration: BoxDecoration(color: Colors.white70),
                    child: Column(
                      children: [
                        SizedBox(height: 10,),
                        Row(
                          children: [
                            SizedBox(width: 6,),
                            SizedBox(
                              width:(showButtom == true ? 346 : 270),
                              height: 40,
                              child: TextField(
                                controller: Message,
                                onChanged: (text){
                                  if(Message.text!=''){
                                    setState(() {
                                      showButtom = false;
                                    });
                                  }
                                  else{
                                    setState(() {
                                      showButtom = true;
                                    });
                                  }
                                },
                                decoration: InputDecoration(
                                  filled: true,
                                  contentPadding: EdgeInsets.all(10.0),
                                  enabledBorder: OutlineInputBorder(
                                    borderSide: BorderSide(color: Color(0x00BB0000)),
                                    borderRadius: BorderRadius.all(
                                      Radius.circular(100),
                                    ),
                                  ),
                                  focusedBorder: OutlineInputBorder(
                                    borderSide: BorderSide(color: Color(0x00000000)),
                                    borderRadius: BorderRadius.all(
                                      Radius.circular(100),
                                    ),
                                  ),
                                ),
                                // autofocus: true,
                              ),
                            ),
                            SizedBox(width: 6,),
                            Offstage(
                              offstage: showButtom,
                              child: SizedBox(
                                child: ElevatedButton(

                                  onPressed: (){
                                    if(Message.text==''){

                                    }else{
                                      print(Message.text);
                                      Message.text = '';

                                    }
                                  },
                                  child: Text('发   送'),
                                  style:ElevatedButton.styleFrom(
                                    shape: RoundedRectangleBorder(
                                      borderRadius: BorderRadius.circular(18.0),
                                    ),
                                  ),
                                ),
                              ),
                            ),

                          ],
                        ),
                        Container(
                          width: 345,
                          child: Scrollbar(
                            child: SingleChildScrollView(
                              scrollDirection: Axis.vertical,
                              reverse: true,
                              child: Column(
                                children: [
                                  SizedBox(height: 10,),
                                  Row(
                                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                    children: [
                                      Icon(Icons.mic_none_sharp),
                                      Icon(Icons.photo_size_select_actual_outlined),
                                      Icon(Icons.camera_alt_outlined),
                                      Icon(Icons.credit_card),
                                      Icon(Icons.sentiment_satisfied_alt_rounded),
                                      Icon(Icons.add_circle_outline),
                                    ],
                                  ),
                                  SizedBox(height: 10,),
                                ],
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          ),
    ),
  );
}

}